
import {Outlet,NavLink,useNavigate} from "react-router-dom"
import { adminChild, userChild } from "../../router";
import IsLogin from "../../utils/isLogin";
import {
    DesktopOutlined,
    FileOutlined,
    PieChartOutlined,
    TeamOutlined,
    UserOutlined,
  } from '@ant-design/icons';
  import { Breadcrumb, Layout, Menu } from 'antd';
  import React, { useState,useEffect } from 'react';
  const { Header, Content, Footer, Sider } = Layout;
  console.log(adminChild,userChild,"zujian");
  
 
 
//   const items = [
//     getItem(<NavLink to="/home/achievement">成绩管理</NavLink>, '1', <PieChartOutlined />),
//     getItem(<NavLink to="/home/test">试题管理</NavLink>, '2', <DesktopOutlined />),
//     getItem(<NavLink to="/home/testpaper">试卷管理</NavLink>, '3', <DesktopOutlined />),
   
//   ];
  const App = () => {
  let navigate = useNavigate()
  let children= localStorage.getItem("user")==="admin"?adminChild:userChild
  function filterRouter (homeChild) {
    const data = []
    homeChild.forEach((item,index)=>{
        data.push({
            key:Math.random(),
            icon:< DesktopOutlined/>,
            label:<NavLink to={item.path}>{item.tit}</NavLink>,
            children:item.children ? filterRouter(item.children):""
        })
    })
    console.log(data,"data");
    // function getItem(label, key, icon, path) {
    //   console.log(label);
    //   const nav = <NavLink to={path}>{label}</NavLink>
    //   return {
    //     key,
    //     icon,
    //     children:"",
    //     label:nav
    //   };
    // }
    return data
 }
  // useEffect(()=>{
  //   if ( !localStorage.getItem("token")) {
  //       navigate("/login")
  //   }
  
  // },[])
    const [collapsed, setCollapsed] = useState(false);
    return (
      <Layout
        style={{
          minHeight: '100vh',
        }}
      >
        <Sider collapsible collapsed={collapsed} onCollapse={(value) => setCollapsed(value)}>
          <div className="logo" />
          <Menu theme="dark" defaultSelectedKeys={['1']} mode="inline" items={filterRouter(children)} />
        </Sider>
        <Layout className="site-layout">
          <Header
            className="site-layout-background"
            style={{
              padding: 0,
              background:"red"
            }}
          />
          <Content
            style={{
              margin: '0 16px',
            }}
          >
            <div
              className="site-layout-background"
              style={{
                padding: 24,
                minHeight: 360,
              }}
            >
              <Outlet></Outlet>
            </div>
          </Content>
          <Footer
            style={{
              textAlign: 'center',
            }}
          >
            Ant Design ©2018 Created by Ant UED
          </Footer>
        </Layout>
      </Layout>
    );
  };
  export default IsLogin(App);